/*
 * @Author: Lin_xi
 * @Date: 2021-06-28 17:20:40
 * @LastEditors: Lin_xi
 * @LastEditTime: 2021-06-28 17:24:16
 * @Description: 可代替mixin
 */

import { ref, onBeforeMount, onMounted, watch } from "vue";

export default function getAge() {
    const age = ref(1);

    // watch在age上----------------------------------------------------
    // 执行顺序：
    //      触发watch--newVal为2 setupWatch
    //      打印ordinary
    //      触发watch--newVal为3 setupWatch & noSetupWatch
    //      打印onBeforeMount
    //      打印onMounted
    //      触发watch--newVal为4 setupWatch & noSetupWatch
    watch(age, (newVal) => {
        console.log(`setup---age:${newVal}`);
    });
    age.value++;
    console.log("ordinary", age.value);
    // ----------------------------------------------------------------

    // watch在age下----------------------------------------------------
    // 执行顺序：
    //      打印ordinary
    //      触发watch--newVal为3 setupWatch & noSetupWatch
    //      打印onBeforeMount
    //      打印onMounted
    //      触发watch--newVal为4 setupWatch & noSetupWatch
    // age.value++;
    // console.log("ordinary", age.value);
    // watch(age, (newVal) => {
    //     console.log(`setup---age:${newVal}`);
    // });
    // ----------------------------------------------------------------

    onBeforeMount(() => {
        age.value++;
        console.log("onBeforeMount", age.value);
    });
    onMounted(() => {
        age.value++;
        console.log("onMounted", age.value);
    });

    return {
        age
    };
}
